<#include "/admin/public.html">
<style type="text/css">
.layui-form-checkbox[lay-skin=primary] {
   height: 30px !important;
   line-height: 28px!important;
}
#uploadfile .filename{
	display:inline-block;
	width:180px;
}
</style>
<div class="uk-layui-form">
    <form class="layui-form uk-form" action="/admin/microcase/save.html"  method="post">
		<input type="hidden" name="parts" id="parts">
        <input type="hidden" name="releasetime" class="layui-input" id="releasetime">
        <input type="hidden" name="microcaseenclosureList">
        
        <input type="hidden" name="essencecase">
        <input type="hidden" name="filelogo" id="filelogo">
        <input type="hidden" name="filelogourl" id="filelogourl">
        
        <div class="layui-form-item">
            <label class="layui-form-label">标题</label>
            <div class="layui-input-inline">
                <input type="text" name="title"  lay-verify="required|max81" id="title" class="layui-input" placeholder="请输入标题" >
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">作者</label>
            <div class="layui-input-inline">
                <input type="text" name="author" id="author"  lay-verify="required" class="layui-input" placeholder="请输入作者">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">价格</label>
            <div class="layui-input-inline">
                <input type="text" name="price" id="price"  lay-verify="required|price" class="layui-input" placeholder="请输入价格">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">配件</label>
            <div class="layui-input-block">
            	<#if dictList?? && dictList??>
				<#list dictList as parts>
					 <input type="checkbox" lay-verify="mountings" class="mountings"  title="${parts.label!''}" value="${parts.id!''}" lay-skin="primary">
				</#list>
				</#if>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">案例等级</label>
            <div class="layui-input-inline">
            	<select name="gradedescribe" id="gradedescribe" placeholder="请选择案例等级" required lay-verify="required">
                	<option value="">请选择案例等级</option>
					<#if dictgread?? && dictgread??>
					<#list dictgread as dic>
						<option value="${dic.id!''}">${dic.label!''}</option>
					</#list>
					</#if>
				</select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">发布时间</label>
            <div class="layui-input-inline">
            	<input type="text" required lay-verify="required" class="layui-input" id="time">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">正文</label>
            <div class="layui-input-block">
            	<textarea id="describecontent" name="describecontent" placeholder="请输入正文" lay-verify="content"  style="height: 260px;"></textarea>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">描述图</label>
            <div class="layui-input-inline">
		      	<a class="layui-btn layui-btn-primary" id="desImgBtn"><i class="layui-icon">&#xe608;</i>上传图片</a>
		    </div>
        </div>
        <div class="layui-form-item layui-hide">
		    <label class="layui-form-label"></label>
		    <div class="layui-input-inline">
		    	<img id="desImg" alt="" src=""  style="width:130px" >
		    </div>
	    </div>
        <div class="layui-form-item">
            <label class="layui-form-label">附件上传</label>
            <div class="layui-input-inline" style="width:250px;">
		      	<a class="layui-btn layui-btn-primary" id="upload"><i class="layui-icon">&#xe608;</i>添加附件</a>
                <p style="color:red;">请上传详细案例和配套代码(最多5个)</p>
		    </div>
		    <div class="layui-form-mid layui-word-aux">
		    	<ul id="uploadfile"></ul>
		    </div>
        </div>
        <#if user.usertype?? && user.usertype == "0">
	  		<div class="layui-form-item">
	            <label class="layui-form-label">是否为精华</label>
	            <div class="layui-input-inline">
			    	<input type="checkbox" name="essencecaseshow" title="精华">
			    </div>
	        </div>
	  	</#if>
        <div class="layui-form-button">
            <div class="layui-button-block">
                <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
    </form>
</div>
<script>
var url = "/uploadmicrocasetwo", layedit,microcaseenclosureList = [],urlImg = "/uploadmicrocase";

layui.use(['form','laydate','layedit'], function() {
    var form = layui.form();
    var laydate = layui.laydate;
    
   var start = {
       istoday: true
       ,choose: function(dates){ //选择好日期的回调
     	  $("#releasetime").val(new Date(dates));
       }
    };
    
    $("#time").click(function(){
    	start.elem = this;
        laydate(start);
    });
    
    form.verify({ 
    	max81:function(value,item){
    		if(value.replace(/[^\u0000-\u00ff]/g,"***").length > 78){
    			return '标题过长！';
    		}
    	},
    	price: function(value, item){ 
	      	if(value < 0) {
	  	       return '案例价格不能小于0';
	  	     }else{
	  	    	if(value === "" || value ==null){
	  	    		return '请输入数字';
	  	        }else if(isNaN(value)){
		  	        return '请输入数字';
		  	    }
	  	    }
  	    },
        content: function(value, item){ 
        	value = ue.getContent();
	      	if(value.length <= 0) {
	  	      return '请输入正文';
	  	     }
	  	  },
	  	mountings: function(value, item){ 
	  		var isEmptypartsVal = [];
		 	$('.mountings:checked').each(function() {
		 		isEmptypartsVal.push($(this).val());
		    });  
	      	if(isEmptypartsVal.length <= 0) {
	  	      return '请选择配件';
	  	     }
	  	  }
  	});   
   //提交
   form.on('submit(formDemo)', function(data){
	 	var partsVal = [];
	 	$('.mountings:checked').each(function() {
	 		partsVal.push($(this).val());
	    });  
	 	$("#parts").val(partsVal.join());
	 	$("input[name=microcaseenclosureList]").val(JSON.stringify(microcaseenclosureList));
	 	
		if( !$("input[name=essencecaseshow]").prop("checked") ){
		  $("input[name=essencecase]").val("0");
	    }else{
		  $("input[name=essencecase]").val("1");
	    }
   }); 
    
});
UE.Editor.prototype.placeholder = function (justPlainText) {
	var _editor = this;
	_editor.addListener("focus", function () {
		var localHtml = _editor.getPlainTxt();
		if ($.trim(localHtml) === $.trim(justPlainText)) {
			_editor.setContent(" ");
		}
	});
	_editor.addListener("blur", function () {
		var localHtml = _editor.getContent();
		if (!localHtml) {
			_editor.setContent(justPlainText);
		}
	});
	_editor.ready(function () {
		_editor.fireEvent("blur");
	});
};
var ue = UE.getEditor('describecontent', {
	//这里可以选择自己需要的工具按钮名称
	toolbars: [
		['Source','|', 'undo', 'redo', 'removeformat', 'backcolor', 'formatmatch','|', 'italic', 'underline', 'Bold', 'test',
			'forecolor','|', 'justifyleft', 'justifycenter', 'justifyright','|','insertorderedlist' ,'|',
			'fontfamily', 'fontsize','|',
			 'simpleupload','emotion'
		]
	],
	wordCount: false,					//开启字数统计
	elementPathEnabled : false
});
//placeholder内容(只能是文本内容)
ue.placeholder("请输入正文");
//上传描述图
//实例化一个plupload上传对象
var uploaderImg = new plupload.Uploader({
	browse_button:'desImgBtn', //触发文件选择对话框的按钮，为那个元素id
    url: "${base}" + urlImg, //服务器端的上传页面地址
    flash_swf_url: '${ctxStatic}/plupload/js//Moxie.swf', //swf文件，当需要使用swf方式进行上传时需要配置该参数
    silverlight_xap_url: '${ctxStatic}/plupload/js/Moxie.xap', //silverlight文件，当需要使用silverlight方式进行上传时需要配置该参数
    filters: {
        mime_types: [{
                title: "Image files",
                extensions: "jpg,jpeg,png,gif"
            },

        ],
        max_file_size: '40mb',
        prevent_duplicates: "true" //不允许选取重复文件
    },
});
//在实例对象上调用init()方法进行初始化
uploaderImg.init();
//绑定各种事件，并在事件监听函数中做你想做的事
uploaderImg.bind('FilesAdded',function(uploader,files){
	if(uploaderImg.settings.browse_button[0].id == "desImgBtn"){
		$("#desImg").parent().parent().removeClass("layui-hide");
		$("#desImg").attr("src","/images/loading-slide.gif");
	}
	uploaderImg.start()
});
//上传后回调
uploaderImg.bind('FileUploaded', function(uploader, UploadProgress, responseObject) {
	 var obj = $.parseJSON(responseObject.response);
	 if(uploader.settings.browse_button[0].id == "desImgBtn"){
 		$("#desImg").attr("src","/" + obj.filePath);
 		$("#filelogourl").val(obj.filePath);
 		$("#filelogo").val(obj.fileName.split(".")[0]);
 	}
});
//报错
uploaderImg.bind('Error', function(up, err) {
    if (err.code == '-600') {
    	layer.msg('文件最多可上传40M', {icon: 5});
    }
});


//实例化一个plupload上传对象
var uploader = new plupload.Uploader({
	browse_button:"upload", //触发文件选择对话框的按钮，为那个元素id
    url: "${base}" + url, //服务器端的上传页面地址
    flash_swf_url: '${ctxStatic}/plupload/js//Moxie.swf', //swf文件，当需要使用swf方式进行上传时需要配置该参数
    silverlight_xap_url: '${ctxStatic}/plupload/js/Moxie.xap', //silverlight文件，当需要使用silverlight方式进行上传时需要配置该参数
    filters: {
        mime_types: [],//默认空数组不做限制
        max_file_size: '40mb',
        prevent_duplicates: "true" //不允许选取重复文件
    },
});
 //在实例对象上调用init()方法进行初始化
 uploader.init();
//绑定各种事件，并在事件监听函数中做你想做的事
 uploader.bind('FilesAdded',function(uploader,files){
		if(uploader.files.length > 5){ //  最多上传5个附件
	        uploader.splice(5,999);
	        layer.msg('最多上传5个附件！', {icon: 1})
	    }
		$.each(files ,function(index,item){
			if($("#uploadfile li").length <= 4){ 
				var $li = '<li id="li-' + item.id + '">' +
						      '<span class="filename layui-elip">' + item.name + '</span>'+
							  '<a href="#" class="deletefile" id="' + item.id + '"><i class="layui-icon" style="font-size: 18px; color: #1E9FFF;">&#x1006;</i></a>' +
						  '</li>';
				$('#uploadfile').append($li);
			}
		})
		
	//上传后删除事件
	$(".deletefile").click(function() {
		var id = $(this).attr('id');
		uploader.removeFile(uploader.getFile(id))
		$.each(microcaseenclosureList,function(index,item) {
			if(item) {
				if(id == item.deleteId) {
					microcaseenclosureList.splice(index,1);
				}
			}
		})
		$("#li-" + id).remove();
	});
	 
     uploader.start();
 });
//上传后回调
uploader.bind('FileUploaded', function(uploader, UploadProgress, responseObject) {
	var obj = $.parseJSON(responseObject.response);
	var json = {};
	json.enclosurename = obj.fileName;
	json.enclosureurl = obj.filePath;
	json.id = obj.fileId;
	json.filetype = "";
	json.deleteId = UploadProgress.id;
	json.filesize = Math.ceil(UploadProgress.origSize / 1024);
	microcaseenclosureList.push(json);
});
//报错
 uploader.bind('Error', function(up, err) {
     if (err.code == '-600') {
     	layer.msg('文件最多可上传40M', {icon: 5});
     }else if (err.code == '-602'){
   	  layer.msg('文件重复！', {icon: 5});
     }	
	 console.log(err)
 })

</script>